<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@ taglib uri="http://richfaces.org/a4j" prefix="a4j"%>
<%@ taglib uri="http://richfaces.org/rich" prefix="rich"%>

<h:panelGrid columns="8" styleClass="normal">
	<h:outputText value="#{bundle.dyeing_start_plan}"/>
	<rich:calendar id="dyeingStartPlan" value="#{con100.selectItem.dyeingStartPlan}" datePattern="dd.MM.yyyy" locale="th_US" disabled="#{!con100.editDye}">
		<a4j:support id="onchangeDyeingStartPlan" event="onchanged" reRender="dyeingStartPlan" actionListener="#{con100.onchangeDyeing}"/>
	</rich:calendar>
	<h:outputText value="#{bundle.dyeing_finish_plan}"/>
	<rich:calendar id="dyeingFinishPlan" value="#{con100.selectItem.dyeingFinishPlan}" datePattern="dd.MM.yyyy" locale="th_US" disabled="#{!con100.editDye}">
		<a4j:support id="onchangeDyeingFinishPlan" event="onchanged" reRender="dyeingFinishPlan" actionListener="#{con100.onchangeDyeing}"/>
	</rich:calendar>
	<h:outputText value="#{bundle.machine}"/>
	<h:inputText id="dyeingFinishMachine" value="#{con100.selectItem.dyeingFinishMachine}" disabled="#{!con100.editDye}">
		<a4j:support id="onchangeDyeingFinishMachine" event="onchange" reRender="dyeingFinishMachine" actionListener="#{con100.onchangeDyeing}"/>
	</h:inputText>
	<h:outputText value="#{bundle.remark}"/> 
	<h:inputTextarea id="dyeingFinishRemark" value="#{con100.selectItem.dyeingFinishRemark}" cols="20" rows="2" disabled="#{!con100.editDye}">
		<a4j:support id="onchangeDyeingFinishRemark" event="onchange" reRender="dyeingFinishRemark" actionListener="#{con100.onchangeDyeing}"/>
	</h:inputTextarea>
	<h:outputText value="#{bundle.dyeing_start_actual}"/>
	<rich:calendar id="dyeingStartActual" value="#{con100.selectItem.dyeingStartActual}" datePattern="dd.MM.yyyy" locale="th_US" disabled="#{!con100.editDye}">
		<a4j:support id="onchangeDyeingStartActual" event="onchanged" reRender="dyeingStartActual" actionListener="#{con100.onchangeDyeing}"/>
	</rich:calendar>
	<h:outputText value="#{bundle.dyeing_finish_actual}"/>
	<rich:calendar id="dyeingFinishActual" value="#{con100.selectItem.dyeingFinishActual}" datePattern="dd.MM.yyyy" locale="th_US" disabled="#{!con100.editDye}">
		<a4j:support id="onchangeDyeingFinishActual" event="onchanged" reRender="dyeingFinishActual" actionListener="#{con100.onchangeDyeing}"/>
	</rich:calendar>	
</h:panelGrid>

<rich:scrollableDataTable var="dyeItem" value="#{con100.dyeItems}" width="950px" height="110px" id="reserveItemDyeTable" selection="#{con100.selectionDye}">
	<rich:column sortable="false">
		<f:facet name="header">
			<h:outputText value="#{bundle.production_no}"></h:outputText>
		</f:facet>
		<h:outputText value="#{dyeItem.id.productionNo}"></h:outputText>
	</rich:column>
	<rich:column sortable="false">
		<f:facet name="header">
			<h:outputText value="#{bundle.material}"></h:outputText>
		</f:facet>
		<h:outputText value="#{dyeItem.material}"></h:outputText>
	</rich:column>		
	<rich:column sortable="false" styleClass="textRight">
		<f:facet name="header">
			<h:outputText value="#{bundle.qty_prod}"></h:outputText>
		</f:facet>
		<h:outputText value="#{dyeItem.quantity}">
			<f:convertNumber pattern="#,##0.000"/>
		</h:outputText>
	</rich:column>
	<rich:column sortable="false" width="40px">
		<f:facet name="header">
			<h:outputText value="#{bundle.uom}"></h:outputText>
		</f:facet>
		<h:outputText value="#{dyeItem.uom}"></h:outputText>
	</rich:column>	
	<rich:column sortable="false" styleClass="textCenter">
		<f:facet name="header">
			<h:outputText value="#{bundle.prod_start_date}"/>
		</f:facet>
		<h:outputText value="#{dyeItem.startDate}">
			<f:convertDateTime pattern="dd.MM.yyyy" locale="th_US"/>
		</h:outputText>
	</rich:column>	
	<rich:column sortable="false" styleClass="textCenter">
		<f:facet name="header">
			<h:outputText value="#{bundle.last_posting_date}"/>
		</f:facet>
		<h:outputText value="#{dyeItem.lastPostingDate}">
			<f:convertDateTime pattern="dd.MM.yyyy" locale="th_US"/>
		</h:outputText>
	</rich:column>		
	<rich:column sortable="false">
		<f:facet name="header">
			<h:outputText value="#{bundle.remark}"></h:outputText>
		</f:facet>
		<h:outputText value="#{dyeItem.reserveDyeRemark}"/>
	</rich:column>
	<rich:column sortable="false" width="80px">
		<f:facet name="header">
			<h:outputText value="Sale Order"></h:outputText>
		</f:facet>
		<h:outputText value="#{dyeItem.saleData.id.saleOrder}"></h:outputText>
	</rich:column>
	<rich:column sortable="false" width="40px">
		<f:facet name="header">
			<h:outputText value="Item"></h:outputText>
		</f:facet>
		<h:outputText value="#{dyeItem.saleData.id.saleItem}"></h:outputText>
	</rich:column>	
	<rich:column sortable="false" styleClass="textCenter">
		<f:facet name="header">
			<h:outputText value="Due Date"/>
		</f:facet>
		<h:outputText value="#{dyeItem.saleData.dueDate}">
			<f:convertDateTime pattern="dd.MM.yyyy" locale="th_US"/>
		</h:outputText>
	</rich:column>
	<rich:column sortable="false" width="40px" styleClass="textCenter">
		<f:facet name="header">
			<h:outputText value="Actions"></h:outputText>
		</f:facet>
		<a4j:commandLink id="editLineDyeLink" reRender="editReserveLineDyePanel" oncomplete="#{rich:component('editReserveLineDyePanel')}.show()" ajaxSingle="true">
			<h:graphicImage value="/images/icon_edit_item.gif" style="border:0" />
		</a4j:commandLink>
	</rich:column>	
	<a4j:support id="take_reservelineDye" event="onselectionchange" actionListener="#{con100.onchangeReserveLineDye}"/>
</rich:scrollableDataTable>

